<div class="album-plan wp-20" ui-view="container">
    <div class="head_title">
        <span class="jump-color" ui-sref="main.playPlan({pageNo:1})">播放方案</span>
        <span class="tit-color"> / 新建方案</span>
    </div>

    <form class="w5c-form demo-form" w5c-form-validate name="playControl">
        <div class="header" style="padding: 20px;margin-top: 15px;background-color: white">方案信息</div>

        <section class="fg-section" style="background-color: white">
            <div class="form-group ">
                <label class=" control-label"><i class="red-icon">*</i>方案名称：</label>
                <input type="text" class="input" ng-model="formData.name"
                       name="planName" required="" ng-minlength="2" ng-maxlength="50">
            </div>
        </section>
        <div class="clear"></div>
        <div style="margin-top: 15px;padding: 20px;background-color: white">
        <label class=" control-label"><i class="red-icon">*</i>方案设置</label>
        </div>
        <section class="fg-section" style="background-color: white;padding: 10px">

            <table class="table  table-hover table-page">
                <tbody>
                <tr ng-repeat="channel in channels">
                    <td style="width: 150px;">
                        {{table[channel.clientType]}}
                    </td>
                    <td style="width: 80px">
                        <label style="cursor: pointer;margin-top: 5px">
                            <input class="magic-checkbox" type="checkbox" ng-model="channel.checked" ng-change="channelCheckedChange(channel)" id="channel{{channel.clientType}}" name=>
                            <label for="channel{{channel.clientType}}" style="padding: 2px 25px 0 0;"></label>
                            全部
                        </label>
                    </td>
                    <td style="text-align: left">
                        <label ng-repeat="item in channel.channelList" style="cursor: pointer;margin-top: 5px">
                            <input id="{{item.id}}" class="magic-checkbox" type="checkbox" ng-model="item.checked" ng-change="itemCheckChange(channel,item)" style="margin-right: 5px">
                            <label for="{{item.id}}" style="padding: 2px 25px 0 0;"></label>
                            {{item.name}}
                        </label>
                    </td>
                </tr>
                </tbody>
            </table>
            <p class="client-error" ng-show="channleErrShow">渠道不能为空</p>

            <div class="form-group " style="display: inline-block">
                <label class=" control-label pull-left" >地域控制：</label>
                <div class="control-group pull-left" style="margin-left: 10px">
                    <label style="cursor: pointer;margin-right: 20px;width: 100px">
                        <input type="radio" ng-model="area" name="area" value="0" id="noLimit" class="magic-radio">
                        <label for="noLimit" style="padding: 2px 25px 0 0"></label>
                        不限制
                    </label>
                    <label style="cursor: pointer;margin-right: 20px;width: 100px">
                        <input type="radio" ng-model="area" name="area" value="1" id="limit" class="magic-radio">
                        <label for="limit" style="padding: 2px 25px 0 0"></label>
                        限制
                    </label>
                </div>

                <div style="border: 1px solid silver;height: 300px;overflow-y: auto;padding: 10px;float: left" ng-show="area==1">
                    <div ng-repeat="province in provinces">
                        <label style="cursor: pointer">
                            <input id="{{province.provinceID}}" class="magic-checkbox" type="checkbox" ng-model="province.checked" ng-change="provinceCheckedChange(province)">
                            <label for="{{province.provinceID}}" style="padding: 2px 25px 0 0"></label>
                            {{province.province}}
                        </label>
                        <div style="margin-left: 20px">
                            <label ng-repeat="city in  province.cities" style="cursor: pointer">
                                <input id="{{city.cityID}}" class="magic-checkbox" type="checkbox" ng-model="city.checked" ng-change="cityCheckedChange(province,city)">
                                <label for="{{city.cityID}}" style="padding: 2px 25px 0 0"></label>
                                {{city.city}}
                            </label>
                        </div>
                    </div>
                </div>
            </div>
            <div class="clear"></div>

            <div class="form-group " style="display: inline-block">
                <label class=" control-label pull-left">下载控制：</label>
                <div class="control-group pull-left" style="margin-left: 10px">
                    <label style="cursor: pointer;margin-right: 20px;width: 100px">
                        <input id="download" class="magic-radio" type="radio"
                               ng-model="formData.downloadControl" name="download" value="1">
                        <label for="download" style="padding: 2px 25px 0 0"></label>
                        允许提供下载
                    </label>
                    <label style="cursor: pointer;margin-right: 20px;width: 100px">
                        <input id="notDownload" class="magic-radio" type="radio" ng-model="formData.downloadControl" name="download" value="0">
                        <label for="notDownload" style="padding: 2px 25px 0 0"></label>
                        不允许
                    </label>
                    <input type="number" ng-model="formData.downloadControl" hidden
                           name="download" required="" style="margin-left: 10px"/>
                </div>
            </div>
            <div class="clear"></div>

            <div class="form-group" style="display: inline-block">
                <label class="control-label pull-left">分享控制：</label>
                <div class="control-group pull-left" style="margin-left: 10px">
                    <label style="cursor: pointer;margin-right: 20px;width: 100px">
                        <input id="share" class="magic-radio" type="radio" ng-model="formData.shareControl" name="share" value="1">
                        <label for="share" style="padding: 2px 25px 0 0"></label>
                        允许分享
                    </label>
                    <label style="cursor: pointer;margin-right: 20px;width: 100px">
                        <input id="noShare" class="magic-radio" type="radio" ng-model="formData.shareControl" name="share" value="0">
                        <label for="noShare" style="padding: 2px 25px 0 0"></label>
                        不允许
                    </label>
                </div>
            </div>
            <div class="clear"></div>

        </section>

        <footer class="container-fluid foot-wrap white-background" style="padding-bottom: 20px">
            <div class="text-center">
                <button class="btn btn-primary" style="width:90px;padding: 3px 16px" type="button" w5c-form-submit="submit()">{{'确定'}}</button>
                <button type="button"  class="btn ims-btn" ui-sref="main.playPlan" style="width: 90px">取消</button>
            </div>
        </footer>

    </form>
</div>
